/**
 * VUEshop
 * ============================================================================
 * * 版权所有 2015-2027 深圳搜豹网络科技有限公司，并保留所有权利。
 * 网站地址: http://www.vueshop.com.cn
 * ----------------------------------------------------------------------------
 * 这不是一个自由软件！您只能在不用于商业目的的前提下对程序代码进行修改和使用 .
 * 不允许对程序代码以任何形式任何目的的再发布。
 * ============================================================================
 * $Author: 沈小白 2020-07-22 $
 */<template> 
	<view>
		<block v-for="(item,index) in treamList" v-if="treamList.length>0||treamList">
			
		
			<view class="team-list">
				<view class="team-item">
					<navigator class="team-pic" :url="'/pages/team/team_info/team_info?goods_id='+item.goods_id+'&item_id='+item.item_id+'&team_id='+item.team_id" role="navigation">
						<image class="wh100" mode="aspectFill" :src="hostUrl+'/mall/goods/thumb_image?goods_id='+ item.goods_id+'&width='+goodsImgWidth+'&height='+goodsImgHeight+'&'+item.goods_id+'.'+imgType" role="img"></image>
					</navigator>
					<view class="team-name ellipsis-2">{{item.goods_name}}</view>
					<view class="team-des">
						<view class="team-price">
							<view class="team-ico">
								<view>
									<image class="wh100" :src="imgUrl+'index/ico-team6.png'" role="img"></image>
								</view>
								{{item.needer}}人团
							</view>
							<view class="co-red">
								<text>
									￥
								</text>
								{{item.team_price}}
							</view>
							<view>单买￥{{item.shop_price}}</view>
						</view>
						<navigator :url="'/pages/team/team_info/team_info?goods_id='+item.goods_id+'&item_id='+item.item_id+'&team_id='+item.team_id" role="navigation">
							<view class="go-team">去开团</view>
						</navigator>
					</view>
				</view>
			</view>
			
	
		</block>
		<view class="no-more" v-if="!treamList.length>0||!treamList">暂无拼团活动</view>
		<view class="no-more" v-show="ishide">没有更多了</view>
	</view>
</template>

<script>
	import {getTreamList} from "@/api/api.js";
	import config from "@/api/config.js";
	import {mapState} from 'vuex';
	export default {
		data() {
			return {
				hostUrl: config.host,
				imgUrl:config.imgUrl,
				treamList:[],//拼团商品列
				total:"",
				ishide:false,
				params:{
					p:1,	
				}
			};
		},
		computed: {
			...mapState(['imgType','goodsImgHeight','goodsImgWidth'])
		},
		onLoad(){
			this._getTreamList(this.params);
		},
		methods:{
		_getTreamList(params){//拼团
				getTreamList(params).then(res=>{
					console.log(res)
					if(res){
						this.treamList=this.treamList.concat(res.records);
						this.total=res.total;
					}
				})
			},
		},
		onReachBottom(){//下拉加载数据
			// console.log("滚动加载")
			if(this.treamList.length===this.total){
				// uni.showToast({
				//     title: '加载完了',
				//     duration: 2000
				// });
				this.ishide=true;
				 return false;
			}
			this.params.p++;
			this._getTreamList(this.params);
			
		},
	}
</script>

<style lang="scss">
	.menu {
		padding: 20px 0;
		display: flex;
		justify-content: space-around;
		background-color: #fff;
	}

	.menu-item {
		width: 20%;
		text-align: center;
	}

	.menu-ico {
		width: 48rpx;
		height: 48rpx;
		margin: 0 auto 12rpx;
	}

	.menu-cont {
		height: 42rpx;
		font-size: 30rpx;
		line-height: 42rpx;
		overflow: hidden;
		color: #666;
	}

	.team-list {
		margin-top: 20rpx;
	}

	.team-item {
		padding: 0 30rpx;
		background-color: #fff;
		padding-bottom: 20rpx;
		margin-bottom: 12rpx;
		width: 710rpx;
		border-radius: 10rpx;
		margin: 0 auto;
		overflow: hidden;
		box-sizing: border-box;
	}

	.team-pic {
		width: 100%;
		height: 650rpx;
		background: #fff;
	}

	.team-name {
		font-size: 28rpx;
		line-height: 42rpx;
		max-height: 84rpx;
		margin: 10rpx 0;
		color: #1d1d1d;
		font-weight: 600;
	}

	.team-des {
		display: flex;
		justify-content: space-between;
	}

	.team-price {
		display: flex;
		font-size: 28rpx;
		color: #666;
		align-items: center;
	}

	.team-price>view {
		margin-right: 12rpx;
		font-size: 22rpx;
	}

	.team-price .co-red {
		font-size: 34rpx;
		font-weight: 600;
	}

	.team-price .co-red text {
		font-size: 24rpx;
	}

	.team-ico {
		display: flex;
		align-items: center;
		font-size: 24rpx;
	}

	.team-ico>view {
		width: 36rpx;
		height: 30rpx;
		margin-right: 6rpx;
	}

	.go-team {
		font-size: 26rpx;
		padding: 2rpx 10rpx;
		color: #ff3b3b;
		border-radius: 10rpx;
		border: 1rpx solid #ff3b3b;
		background: #fff;
	}

	.no-more {
		text-align: center;
		line-height: 2;
	}
</style>
